<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>登录页面</title>
    <link rel="stylesheet" href="https://cdn.bootcdn.net/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.min.css">
    <link rel="stylesheet" href="./css/login.css">
    <script src="./jquery-3.5.1.min.js"></script>
</head>
<body class="app-container">
    
    <div class="container">
        
        <div class="panel panel-default">
            <div class="panel-body">
               
                   <legend>用户登录</legend>
               
                   <div class="form-group">
                       <label for="">用户名</label>
                       <input type="text" class="form-control" id="userId" placeholder="请输入用户名">
                   </div>
                   <div class="form-group">
                    <label for="">密码</label>
                    <input type="password" class="form-control" id="userPwd" placeholder="请输入您的密码">
                </div>
                   <button type="submit" id="sub" class="btn btn-primary">提交</button>
               
            </div>
        </div>
        
    </div>
    <script src="./js/crypto-js.js"></script>
    <script>
        $('#sub').on('click',() => {
            var userId = $('#userId').val()
            var userPwd = $('#userPwd').val()
            if (!userId) {
                alert('请输入您的用户名')
                return
            }
            if (!userPwd) {
                alert('请输入您的密码')
                return
            }

            //对用户输入的密码进行加密
            userPwd = CryptoJS.MD5(userPwd).toString().toLocaleUpperCase()
            
            $.ajax({
                url:'/user/login',
                type:'POST',
                data:{userId,userPwd},
                success:function(data) {
                    if(data.code === 200) {
                        alert('登录成功')
                        sessionStorage.setItem('user_info',JSON.stringify(data.data))
                        window.location.href = './user-manage.html'
                    }else{
                        alert(data.message)
                    }
                },
                error:function(e) {
                    alert('登录错误，请重试')
                    console.log(e)
                }
            })
        })
    </script>
</body>
</html>